<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 标题 -->
    <title>每日正念制作</title>
    <!-- 关键词 -->
    <meta name="keywords" content="" />
    <!-- 网站简介 -->
    <meta name="description" content="" />
    <!-- 自适应屏幕 -->
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
    <!-- IE兼容 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link href="css/banner.css" rel="stylesheet" />
    <!-- 最新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="css/bootstrap.css">
    <!-- 核心 CSS 文件 -->
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body class="bg-white">
    <!-- 顶部 -->
    <div class="top">
        <h4>每日正念<a href=""><span class="iconfont">&#xe60e;</span></a></h4>  
    </div>
    
    <!-- 每日正念图像 -->
    <div class="mind-made-photo">
       <form id="" method="post" enctype="multipart/form-data" >
            <div class="goods-pic">
                <a href="javascript:void(0);" class="input-file">
                   <input type="file" name="file" id="take-picture" class="tpic1" onchange="getFileSize(this.value)">更换封面
                </a>
               <img src="images/meihua.png" id="show-picture" alt="">
            </div>
        </form>
    </div>
    
    <!-- 选择问候 -->
    <div class="mind-made-greetings container">
        <h4>选择问候</h4>
        <ul class="clearfix"> 
           <li class="clearfix">
               <div class="left"><input type="radio" name="radio" value="radio" id="radio-1" checked><label for="radio-1"></label></div>
               <div class="right">早安你好</div>
           </li>
           <li class="clearfix">
               <div class="left"><input type="radio" name="radio" value="radio" id="radio-2"><label for="radio-2"></label></div>
               <div class="right">晚安你好</div>
           </li> 
        </ul>
    </div>

    <div class="mind-made-chanyu">
        <h4>正念禅语</h4>
        <!-- 选项卡导航 -->
        <ul class="nav clearfix" role="tablist" id="myTab">
            <li role="presentation" class="active"><a href="#mind-a" aria-controls="mind-a" role="tab" data-toggle="tab">系统选择</a></li>
            <li role="presentation" class=""><a href="#mind-b" aria-controls="mind-b" role="tab" data-toggle="tab">自定义文字</a></li>
        </ul>

        <!-- 选项卡内容 -->
        <div class="tab-content">
            <!-- 系统选择 -->
            <div role="tabpanel" class="tab-pane active" id="mind-a">
                <p>忘记并不等于从未存在，一切自在来源于选择，而不是刻意。不如放手，放下的越多，越觉得拥有的更多。</p>
                <div class="mind-change"><a href="">换一段</a></div>
                <div class="mind-see">
                    <a href=""><span class="iconfont">&#xe613;</span>预览</a>
                    <a href="" class="shengcheng">生成</a>
                </div>
            </div>

            <!-- 自定义文字 -->
            <div role="tabpanel" class="tab-pane  container" id="mind-b">
                <form action="">
                    <textarea name="" class="form-control" placeholder="请输入您的问候语" ></textarea>
                </form>
                <div class="mind-see">
                    <a href=""><span class="iconfont">&#xe613;</span>预览</a>
                    <a href="" class="shengcheng">生成</a>
                </div>
            </div>
        </div>
    </div>



    <!-- jQuery文件 -->
    <script src="js/jquery.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="js/bootstrap.min.js"></script>
    <!-- 图像调用 -->
    <script src="js/photo.js"></script>
</body>
</html>
